// load 页面所有文件加载完才会执行
window.addEventListener('load', function () {
    // 顶部右边侧边栏模块制作 滚动到一定的距离 sliderbar盒子改为固定定位
    // 1.获取元素
    // 获取顶部右边侧边栏
    var sliderbar = document.querySelector('.slider-bar');
    // 获取用来定位的盒子
    var search = document.querySelector('#sliderbarTOP');
    // 顶部右边侧边栏 距离顶部的距离
    var sliderbarTOP = sliderbar.offsetTop;
    //search 距离顶部的距离
    var searchTop = search.offsetTop;
    // 固定定位之后的值
    var Fixed = sliderbarTOP - searchTop;
    // 获取返回顶部的按钮
    var goBack = document.querySelector('.goBack');
    // 获取要判断要返回顶部的距离
    var like = document.querySelector('.likearr');
    var liketop = like.offsetTop;
    // console.log(sliderbarTOP);
    // 2.scroll 滚动事件 当滚动条发生变化会触发的事件
    document.addEventListener('scroll', function () {
        // 页面被卷去的头部是window.pageYOffset获取
        var top = window.pageYOffset;
        if (top >= searchTop) {
            sliderbar.style.position = 'fixed';
            sliderbar.style.top = Fixed + 'px';
            // sliderbar.style.top = 60 + 'px'; 不能写死不然效果不好
        } else {
            sliderbar.style.position = 'absolute';
            sliderbar.style.top = sliderbarTOP + 'px';
        }
        // 返回顶部

        if (top >= liketop) {
            goBack.style.display = 'block';
        } else {
            goBack.style.display = 'none';
        }
    });
    // 点击按钮返回顶部
    goBack.addEventListener('click', function () {
        // 调用浏览器滚动的缓动动画
        windowanimate(goBack, 0);
        // console.log(11);
    });
});